// 1. React核心库
import React from 'react';

// 2. UI组件库
import { Card, Spin } from 'antd';

// 4. 专业组件库
import { PageContainer as ProPageContainer } from '@ant-design/pro-components';

interface PageContainerProps {
  title?: string;
  subTitle?: string;
  loading?: boolean;
  children: React.ReactNode;
  extra?: React.ReactNode;
  breadcrumb?: any;
  content?: React.ReactNode;
  tabList?: any[];
  tabActiveKey?: string;
  onTabChange?: (key: string) => void;
  className?: string;
  style?: React.CSSProperties;
}

const PageContainer: React.FC<PageContainerProps> = ({
  title,
  subTitle,
  loading = false,
  children,
  extra,
  breadcrumb,
  content,
  tabList,
  tabActiveKey,
  onTabChange,
  className,
  style,
}) => {
  return (
    <ProPageContainer
      title={title}
      subTitle={subTitle}
      extra={extra}
      breadcrumb={breadcrumb}
      content={content}
      tabList={tabList}
      tabActiveKey={tabActiveKey}
      onTabChange={onTabChange}
      className={className}
      style={style}
    >
      <Spin spinning={loading}>
        <Card bordered={false}>
          {children}
        </Card>
      </Spin>
    </ProPageContainer>
  );
};

export default PageContainer;
